<template>
<!--创建卷优先级策略-->
  <div>
    <a-drawer
      :title="$t('Create-volume-policy')"
      placement="right"
      :visible="visible"
      width="50%"
      @close="onClose"
      :maskClosable="false">
        <a-form :form='form'>
          <!--基本规则-->
          <div>
            <span class="font-style">{{$t('Basic-rule')}}</span>
            <a-popover>
              <template slot="content" v-if="$store.state.language=='zh'">
                <div v-if="$store.state.language=='zh'">一般情况下，引用本条规则的块设备将按照此规则进行读写控制。</div>
              </template>
              <template slot="content" v-else>
                <div>Generally, block devices that reference this rule will perform read-write control according to this rule.</div>
              </template>
              <img class="tip-img" src="../../../../../../static/images/disk_check/16_f_ic_why.png" alt="why_img"/>
            </a-popover>
          </div>
          <!--iops总-->
          <a-row>
            <a-col :span="12">
              <a-row>
                <a-col :span="24">
                  <a-form-item :label="$t('Iops-total')" v-bind='formlayout'>
                    <a-input v-decorator="['iops_total',{rules:[{pattern:numPattern2,message:this.$t('Only-enter-int')}]}]" 
                            :placeholder="$t('Enter')+$t('Int-num')" :addon-after="$t('Times-second')" ></a-input>
                  </a-form-item>
                </a-col>
                <!-- <a-col :span="8">
                  <a-form-item label="" v-bind='formlayout' >
                    <a-select v-decorator="['iops_r_unit',{}]" :placeholder="$t('Choose')+$t('Unit')" allowClear style="width:120px"> 
                      <a-select-option v-for='u in unit' :key='u'>{{u}}</a-select-option>
                    </a-select>
                  </a-form-item>
                </a-col> -->
              </a-row>
            </a-col>
            <a-col :span="12">
              <a-row>
                <a-col :span="16">
                  <a-form-item :label="$t('Bps-total')" v-bind='formlayout' :validate-status="valueStatus1" :help="valueTip1">
                    <a-input v-decorator="['bps_total',{rules:[{pattern:numPattern,message:this.$t('Only-enter-int'),validator:bpsValuePattern1}]}]" 
                            :placeholder="$t('Enter')+$t('Int-num')"></a-input>
                  </a-form-item>
                </a-col>
                <a-col :span="8">
                  <a-form-item label="" v-bind='formlayout' :validate-status="unitStatus1" :help="unitTip1">
                    <a-select v-decorator="['bps_total_unit',{rules:[{validator:bpsUnitPattern1}]}]" :placeholder="$t('Choose')+$t('Unit')" allowClear style="width:120px"> 
                      <a-select-option v-for='u in unit' :key='u'>{{u}}</a-select-option>
                    </a-select>
                  </a-form-item>
                </a-col>
              </a-row>
            </a-col>
          </a-row>
          <!--iops读-->
          <a-row>
            <a-col :span="12">
              <a-row>
                <a-col :span="24">
                  <a-form-item :label="$t('Iops-read')" v-bind='formlayout'>
                    <a-input v-decorator="['iops_r',{rules:[{pattern:numPattern2,message:this.$t('Only-enter-int')}]}]" 
                            :placeholder="$t('Enter')+$t('Int-num')" :addon-after="$t('Times-second')"></a-input>
                  </a-form-item>
                </a-col>
                <!-- <a-col :span="8">
                  <a-form-item label="" v-bind='formlayout' >
                    <a-select v-decorator="['iops_r_unit',{}]" :placeholder="$t('Choose')+$t('Unit')" allowClear style="width:120px"> 
                      <a-select-option v-for='u in unit' :key='u'>{{u}}</a-select-option>
                    </a-select>
                  </a-form-item>
                </a-col> -->
              </a-row>
            </a-col>
            <a-col :span="12">
              <a-row>
                <a-col :span="16">
                  <a-form-item :label="$t('Bps-read')" v-bind='formlayout' :validate-status="valueStatus2" :help="valueTip2">
                    <a-input v-decorator="['bps_r',{rules:[{pattern:numPattern,message:this.$t('Only-enter-int'),validator:bpsValuePattern2}]}]" 
                            :placeholder="$t('Enter')+$t('Int-num')"></a-input>
                  </a-form-item>
                </a-col>
                <a-col :span="8">
                  <a-form-item label="" v-bind='formlayout' :validate-status="unitStatus2" :help="unitTip2">
                    <a-select v-decorator="['bps_r_unit',{rules:[{validator:bpsUnitPattern2}]}]" :placeholder="$t('Choose')+$t('Unit')" allowClear style="width:120px"> 
                      <a-select-option v-for='u in unit' :key='u'>{{u}}</a-select-option>
                    </a-select>
                  </a-form-item>
                </a-col>
              </a-row>
            </a-col>
          </a-row>
          <!--iops写-->
          <a-row>
            <a-col :span="12">
              <a-row>
                <a-col :span="24">
                  <a-form-item :label="$t('Iops-write')" v-bind='formlayout'>
                    <a-input v-decorator="['iops_w',{rules:[{pattern:numPattern2,message:this.$t('Only-enter-int')}]}]" 
                            :placeholder="$t('Enter')+$t('Int-num')" :addon-after="$t('Times-second')"></a-input>
                  </a-form-item>
                </a-col>
                <!-- <a-col :span="8">
                  <a-form-item label="" v-bind='formlayout' >
                    <a-select v-decorator="['iops_w_unit',{}]" :placeholder="$t('Choose')+$t('Unit')" allowClear style="width:120px"> 
                      <a-select-option v-for='u in unit' :key='u'>{{u}}</a-select-option>
                    </a-select>
                  </a-form-item>
                </a-col> -->
              </a-row>
            </a-col>
            <a-col :span="12">
              <a-row>
                <a-col :span="16">
                  <a-form-item :label="$t('Bps-write')" v-bind='formlayout' :validate-status="valueStatus3" :help="valueTip3">
                    <a-input v-decorator="['bps_w',{rules:[{pattern:numPattern,message:this.$t('Only-enter-int'),validator:bpsValuePattern3}]}]" 
                            :placeholder="$t('Enter')+$t('Int-num')"></a-input>
                  </a-form-item>
                </a-col>
                <a-col :span="8">
                  <a-form-item label="" v-bind='formlayout' :validate-status="unitStatus3" :help="unitTip3">
                    <a-select v-decorator="['bps_w_unit',{rules:[{validator:bpsUnitPattern3}]}]" :placeholder="$t('Choose')+$t('Unit')" allowClear style="width:120px"> 
                      <a-select-option v-for='u in unit' :key='u'>{{u}}</a-select-option>
                    </a-select>
                  </a-form-item>
                </a-col>
              </a-row>
            </a-col>
          </a-row>
          <!--突发规则-->
          <div>
            <span class="font-style">{{$t('Burst-rule')}}</span>
            <a-popover>
              <template slot="content" v-if="$store.state.language=='zh'">
                <div>某些特殊情况下，磁盘会有突发性读写需求，导致短时间内数据剧增，本条规则规定这种情况下的磁盘读写限制。</div>
              </template>
              <template slot="content" v-else>
                <div>In some special cases, the disk will have sudden read-write requirements, resulting in a sharp increase in data in a short time. This rule stipulates the disk read-write restrictions in this case.</div>
              </template>
              <img class="tip-img" src="../../../../../../static/images/disk_check/16_f_ic_why.png" alt="why_img"/>
            </a-popover>
          </div>
          <!--iops总-->
          <a-row>
            <a-col :span="12">
              <a-form-item :label="$t('Iops-total')" v-bind='formlayout'>
                <a-input v-decorator="['iops2_total',{rules:[{pattern:numPattern2,message:this.$t('Only-enter-int')}]}]" 
                        :placeholder="$t('Enter')+$t('Int-num')" :addon-after="$t('Times-second')"></a-input>
              </a-form-item>
            </a-col>
            <!-- <a-col :span="12">
              <a-form-item label="" v-bind='formlayout'>
                <a-input v-decorator="['iops2_total_second',{rules:[{pattern:numPattern,message:this.$t('Only-enter-int')}],initialValue:1}]" :addon-after="$t('Seconds')" 
                        :placeholder="$t('Set-valid-time')" class="second-input" />
              </a-form-item>
            </a-col> -->
          </a-row>
          <a-row>
            <a-col :span="12">
              <a-form-item :label="$t('Iops-read')" v-bind='formlayout'>
                <a-input v-decorator="['iops_r2',{rules:[{pattern:numPattern2,message:this.$t('Only-enter-int')}]}]" 
                        :placeholder="$t('Enter')+$t('Int-num')" :addon-after="$t('Times-second')"></a-input>
              </a-form-item>
            </a-col>
            <!-- <a-col :span="12">
              <a-form-item label="" v-bind='formlayout'>
                <a-input v-decorator="['iops_r2_second',{rules:[{pattern:numPattern,message:this.$t('Only-enter-int')}],initialValue:1}]" :addon-after="$t('Seconds')" 
                        :placeholder="$t('Set-valid-time')" class="second-input"/>
              </a-form-item>
            </a-col> -->
          </a-row>
          <a-row>
            <a-col :span="12">
              <a-form-item :label="$t('Iops-write')" v-bind='formlayout'>
                <a-input v-decorator="['iops_w2',{rules:[{pattern:numPattern2,message:this.$t('Only-enter-int')}]}]" 
                        :placeholder="$t('Enter')+$t('Int-num')" :addon-after="$t('Times-second')"></a-input>
              </a-form-item>
            </a-col>
            <!-- <a-col :span="4">
              <a-form-item label="" v-bind='formlayout' >
                <a-select v-decorator="['iops_w2_unit',{}]" :placeholder="$t('Choose')+$t('Unit')" allowClear style="width:120px"> 
                  <a-select-option v-for='u in unit' :key='u'>{{u}}</a-select-option>
                </a-select>
              </a-form-item>
            </a-col> -->
            <!-- <a-col :span="12">
              <a-form-item label="" v-bind='formlayout'>
                <a-input v-decorator="['iops_w2_second',{rules:[{pattern:numPattern,message:this.$t('Only-enter-int')}],initialValue:1}]" :addon-after="$t('Seconds')" 
                        :placeholder="$t('Set-valid-time')" class="second-input"/>
              </a-form-item>
            </a-col> -->
          </a-row>
          <!--bps总-->
          <a-row>
            <a-col :span="12">
              <a-form-item :label="$t('Bps-total')" v-bind='formlayout' :validate-status="valueStatus4" :help="valueTip4">
                <a-input v-decorator="['bps2_total',{rules:[{pattern:numPattern,message:this.$t('Only-enter-int'),validator:bpsValuePattern4}]}]" 
                        :placeholder="$t('Enter')+$t('Int-num')"></a-input>
              </a-form-item>
            </a-col>
            <a-col :span="4">
              <a-form-item label="" v-bind='formlayout' :validate-status="unitStatus4" :help="unitTip4">
                <a-select v-decorator="['bps_r2_unit_total',{rules:[{validator:bpsUnitPattern4}]}]" :placeholder="$t('Choose')+$t('Unit')" allowClear style="width:120px"> 
                  <a-select-option v-for='u in unit' :key='u'>{{u}}</a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <!-- <a-col :span="8">
              <a-form-item label="" v-bind='formlayout'>
                <a-input v-decorator="['bps_r2_second_total',{rules:[{pattern:numPattern,message:this.$t('Only-enter-int')}],initialValue:1}]" :addon-after="$t('Seconds')" 
                        :placeholder="$t('Set-valid-time')" class="second-input"/>
              </a-form-item>
            </a-col> -->
          </a-row>
          <a-row>
            <a-col :span="12">
              <a-form-item :label="$t('Bps-read')" v-bind='formlayout' :validate-status="valueStatus5" :help="valueTip5">
                <a-input v-decorator="['bps_r2',{rules:[{pattern:numPattern,message:this.$t('Only-enter-int'),validator:bpsValuePattern5}]}]" 
                        :placeholder="$t('Enter')+$t('Int-num')"></a-input>
              </a-form-item>
            </a-col>
            <a-col :span="4">
              <a-form-item label="" v-bind='formlayout' :validate-status="unitStatus5" :help="unitTip5">
                <a-select v-decorator="['bps_r2_unit',{rules:[{validator:bpsUnitPattern5}]}]" :placeholder="$t('Choose')+$t('Unit')" allowClear style="width:120px"> 
                  <a-select-option v-for='u in unit' :key='u'>{{u}}</a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <!-- <a-col :span="8">
              <a-form-item label="" v-bind='formlayout'>
                <a-input v-decorator="['bps_r2_second',{rules:[{pattern:numPattern,message:this.$t('Only-enter-int')}],initialValue:1}]" :addon-after="$t('Seconds')" 
                        :placeholder="$t('Set-valid-time')" class="second-input"/>
              </a-form-item>
            </a-col> -->
          </a-row>
          <a-row>
            <a-col :span="12">
              <a-form-item :label="$t('Bps-write')" v-bind='formlayout' :validate-status="valueStatus6" :help="valueTip6">
                <a-input v-decorator="['bps_w2',{rules:[{pattern:numPattern,message:this.$t('Only-enter-int'),validator:bpsValuePattern6}]}]" 
                        :placeholder="$t('Enter')+$t('Int-num')"></a-input>
              </a-form-item>
            </a-col>
            <a-col :span="4">
              <a-form-item label="" v-bind='formlayout' :validate-status="unitStatus6" :help="unitTip6">
                <a-select v-decorator="['bps_w2_unit',{rules:[{validator:bpsUnitPattern6}]}]" :placeholder="$t('Choose')+$t('Unit')" allowClear style="width:120px"> 
                  <a-select-option v-for='u in unit' :key='u'>{{u}}</a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <!-- <a-col :span="8">
              <a-form-item label="" v-bind='formlayout'>
                <a-input v-decorator="['bps_w2_second',{rules:[{pattern:numPattern,message:this.$t('Only-enter-int')}],initialValue:1}]" :addon-after="$t('Seconds')" 
                        :placeholder="$t('Set-valid-time')" class="second-input" />
              </a-form-item>
            </a-col> -->
          </a-row>
          <!--本条规则设置-->
          <div>
            <span class="font-style">{{$t('Rule-set')}}</span>
            <a-popover>
              <template slot="content" v-if="$store.state.language=='zh'">
                <div>只可引用，不可编辑：其他用户只能引用这条规则，不得编辑或删除</div>
                <div>可引用，可编辑：其他用户不仅可引用这条规则，也可编辑或删除</div>
                <div>个人专用：只有创建人或更高级管理员可以引用、编辑或删除本条规则</div>
              </template>
              <template slot="content" v-else>
                <div>Reference only, non editable: other users can only reference this rule, and cannot edit or delete it</div>
                <div>Referenced, editable: other users can not only reference this rule, but also edit or delete it</div>
                <div>Personal use: only the creator or higher level administrator can reference, edit or delete this rule</div>
              </template>
              <img class="tip-img" src="../../../../../../static/images/disk_check/16_f_ic_why.png" alt="why_img" />
            </a-popover>
          </div>
          <!-- 共享策略 -->
          <a-form-item :label="$t('Share-policy')" v-bind='formlayout2' >
            <a-select v-decorator="['share_policy',{initialValue:'2'}]" 
                      :placeholder="this.$store.state.language=='zh'?'请选择本条规则的共享策略':'Please select the sharing policy of this rule'" > 
              <a-select-option key='0'>{{$t('Person-use')}}</a-select-option><!--个人专用-->
              <a-select-option key='1'>{{$t('Only-ref-no-edit')}}</a-select-option><!--只可引用，不可编辑-->
              <a-select-option key='2'>{{$t('Ref-edit')}}</a-select-option><!--可引用，可编辑-->
            </a-select>
          </a-form-item>
          <a-form-item :label="$t('Reg-identify')" v-bind='formlayout2' >
            <a-input v-decorator="['mark',{
              rules:[{required:true,message:$t('Enter')+$t('Reg-identify')},{validator: identifyLength}]
            }]" :placeholder="$t('Enter')+$t('Reg-identify')"/>
          </a-form-item>
          <a-form-item :label="$t('Rule-desc')" v-bind='formlayout2' >
            <a-textarea v-decorator="['desc',{rules:[{validator: descLength}]}]" :autoSize="{ minRows: 4,maxRows: 6}" 
                        :placeholder="$store.state.language=='zh'?'请输入规则描述，该描述方便您或他人查看本规则的使用场景。':'Please enter the rule description, which is convenient for you or others to view the usage scenarios of this rule.'"/>
          </a-form-item>
          <a-row>
            <a-col :span="24" :style="{ textAlign: 'right' }">
              <a-button @click="handleReset" style="width:80px">
                {{$t('Cancel')}}
              </a-button>
              <a-button :style="{ marginLeft:'8px',width:'80px' }" type="primary" @click="handleSubmit" :loading="submitBtnLoading">
                {{$t('Sure')}}
              </a-button>
            </a-col>
          </a-row>
        </a-form>
    </a-drawer>
  </div>
</template>

<script>
import request from '@/request/request'

export default {
  name: "CreatePolicy",
  props: {
    visible: {
      type: Boolean
    },
  },
  data() {
    return {
      form:this.$form.createForm(this),
      formlayout:{
        labelCol:{span:8},
        wrapperCol:{span:16}
      },
      formlayout2:{
        labelCol:{span:4},
        wrapperCol:{span:12}
      },
      numPattern: /(^0{0,1}$)|^[1-9]\d{0,7}$/, // /^[1-9]\d{0,7}$/
      numPattern2: /(^0{0,1}$)|^[1-9]\d{0,7}$/,
      unit: ['KiB/s','MiB/s','GiB/s'],
      // user_id: localStorage.getItem('user_id'),
      valueStatus1: '',
      valueTip1: '',
      valueStatus2: '',
      valueTip2: '',
      valueStatus3: '',
      valueTip3: '',
      valueStatus4: '',
      valueTip4: '',
      valueStatus5: '',
      valueTip5: '',
      valueStatus6: '',
      valueTip6: '',
      unitStatus1: '',
      unitTip1: '',
      unitStatus2: '',
      unitTip2: '',
      unitStatus3: '',
      unitTip3: '',
      unitStatus4: '',
      unitTip4: '',
      unitStatus5: '',
      unitTip5: '',
      unitStatus6: '',
      unitTip6: '',
      submitBtnLoading: false,
    }
  },
  methods: {
    //提交创建卷优先级
    handleSubmit(e) {
      e.preventDefault();
      this.form.validateFields((err,value)=>{
        if(!err){
          if(this.form.getFieldValue('iops_total') || this.form.getFieldValue('bps_total') || this.form.getFieldValue('iops_r')
          || this.form.getFieldValue('bps_r') || this.form.getFieldValue('iops_w') || this.form.getFieldValue('bps_w') 
          || this.form.getFieldValue('iops2_total') || this.form.getFieldValue('iops_r2')
          || this.form.getFieldValue('iops_w2') || this.form.getFieldValue('iops_w2') || this.form.getFieldValue('bps2_total')
          || this.form.getFieldValue('bps_r2') || this.form.getFieldValue('bps_w2')|| this.form.getFieldValue('bps2_total')
          ) {
            this.submitBtnLoading = true;
            request('put', 'block/strategy/',{
              // user_id: this.user_id, //登录用户id
              rbd_qos_iops_limit: Number(value.iops_total), //基本规则，iops总
              rbd_qos_bps_limit_num: Number(value.bps_total), //基本规则，bps总,数字
              rbd_qos_bps_limit_unit: value.bps_total_unit?value.bps_total_unit:null, //基本规则，bps总，单位
              rbd_qos_read_iops_limit: Number(value.iops_r), //基本规则，iops读
              rbd_qos_read_bps_limit_num: Number(value.bps_r), //基本规则，bps读，数字
              rbd_qos_read_bps_limit_unit: value.bps_r_unit?value.bps_r_unit:null, //基本规则，bps读，单位
              rbd_qos_write_iops_limit: Number(value.iops_w), //基本规则，iops写
              rbd_qos_write_bps_limit_num: Number(value.bps_w), //基本规则，bps写，数字
              rbd_qos_write_bps_limit_unit: value.bps_w_unit?value.bps_w_unit:null, //基本规则，bps写，单位
              rbd_qos_iops_burst: Number(value.iops2_total), //突发规则，iops总
              // rbd_qos_iops_burst_seconds: Number(value.iops2_total_second), //突发规则，iops总，秒
              rbd_qos_read_iops_burst: Number(value.iops_r2), //突发规则，iops读
              // rbd_qos_read_iops_burst_seconds: Number(value.iops_r2_second), //突发规则，iops读，秒
              rbd_qos_write_iops_burst: Number(value.iops_w2), //突发规则，iops写
              // rbd_qos_write_iops_burst_seconds: Number(value.iops_w2_second), //突发规则，iops写，秒
              rbd_qos_bps_burst_num: Number(value.bps2_total), //突发规则，bps总，数字
              rbd_qos_bps_burst_unit: value.bps_r2_unit_total?value.bps_r2_unit_total:null, //突发规则，bps总，单位
              // rbd_qos_bps_burst_seconds: Number(value.bps_r2_second_total), //突发规则，bps总，秒
              rbd_qos_read_bps_burst_num: Number(value.bps_r2), //突发规则，bps读，数字
              rbd_qos_read_bps_burst_unit: value.bps_r2_unit?value.bps_r2_unit:null, //突发规则，bps读，单位
              // rbd_qos_read_bps_burst_seconds: Number(value.bps_r2_second), //突发规则，bps读，秒
              rbd_qos_write_bps_burst_num: Number(value.bps_w2), //突发规则，bps写，数字
              rbd_qos_write_bps_burst_unit: value.bps_w2_unit?value.bps_w2_unit:null, //突发规则，bps写，单位
              // rbd_qos_write_bps_burst_seconds: Number(value.bps_w2_second), //突发规则，bps写，秒
              sharing_strategy: value.share_policy,
              identifier: value.mark?value.mark:'',
              describe: value.desc?value.desc:''
            }).then(res => {
              // console.log('创建卷优先级', res)
              this.model(res.data.id) //返回模板
              this.notice(res.data.id, res.data.params, res.data.flag) //通知列表显示
              this.handleReset();
              this.$emit('updateList');
            }).catch(err => {
              console.log(err);
            }).finally(() => {
              this.submitBtnLoading = false;
            })
          }else {
            if(this.$store.state.language == 'zh') {
              this.$message.error('请至少选择任意规则中的一项进行填写！');
            }else {
              this.$message.error('Please select at least one of any rules to fill in!');
            }
          }
        }
      })
      
    },

    //取消按钮
    handleReset() {
      this.$emit('closeDialog','add')
      this.form.resetFields();
      this.unitTip1 = '';
      this.unitStatus1 = '';
      this.unitTip2 = '';
      this.unitStatus2 = '';
      this.unitTip3 = '';
      this.unitStatus3 = '';
      this.unitTip4 = '';
      this.unitStatus4 = '';
      this.unitTip5 = '';
      this.unitStatus5 = '';
      this.unitTip6 = '';
      this.unitStatus6 = '';
      this.valueTip1 = '';
      this.valueStatus1 = '';
      this.valueTip2 = '';
      this.valueStatus2 = '';
      this.valueTip3 = '';
      this.valueStatus3 = '';
      this.valueTip4 = '';
      this.valueStatus4 = '';
      this.valueTip5 = '';
      this.valueStatus5 = '';
      this.valueTip6 = '';
      this.valueStatus6 = '';
    },

    //关闭弹窗
    onClose() {
      this.$emit('closeDialog','add');
      this.form.resetFields();
      this.unitTip1 = '';
      this.unitStatus1 = '';
      this.unitTip2 = '';
      this.unitStatus2 = '';
      this.unitTip3 = '';
      this.unitStatus3 = '';
      this.unitTip4 = '';
      this.unitStatus4 = '';
      this.unitTip5 = '';
      this.unitStatus5 = '';
      this.unitTip6 = '';
      this.unitStatus6 = '';
      this.valueTip1 = '';
      this.valueStatus1 = '';
      this.valueTip2 = '';
      this.valueStatus2 = '';
      this.valueTip3 = '';
      this.valueStatus3 = '';
      this.valueTip4 = '';
      this.valueStatus4 = '';
      this.valueTip5 = '';
      this.valueStatus5 = '';
      this.valueTip6 = '';
      this.valueStatus6 = '';
    },

    //规则描述符长度限制
    identifyLength(rule, value, callback) {
      if(value) {
        if(value.toString().length > 10) {
          if(this.$store.state.language == 'zh') {
            callback('不能输入超过10个字符');
          }else {
            callback('Cannot enter more than 10 characters')
          }
        }else {
          callback();
        }
      }else {
        callback();
      }
      
    },
    //规则描述长度限制
    descLength(rule, value, callback) {
      if(value) {
        if(value.toString().length > 200) {
          if(this.$store.state.language == 'zh') {
            callback('不能输入超过200个字符');
          }else {
            callback('Cannot enter more than 200 characters')
          }
        }else {
          callback();
        }
      }else {
        callback();
      }
    },

    //检测选择单位后数值是否为空
    bpsValuePattern1(rule, value, callback) {
      if(value) {
        if(rule.pattern.test(value)) {
          this.valueStatus1 = '';
          this.valueTip1 = '';
          callback();
        }else {
          this.valueStatus1 = 'error';
          this.valueTip1 = this.$t('Only-enter-int');
          return;
        }
      }
      if(this.form.getFieldValue('bps_total_unit') && value==undefined) {
        this.valueStatus1 = 'error';
        this.valueTip1 = this.$t('Enter') + this.$t('Int-num');
      }else {
        this.valueStatus1 = '';
        this.valueTip1 = '';
        callback();
      }
    },
    bpsValuePattern2(rule, value, callback) {
      if(value) {
          if(rule.pattern.test(value)) {
          this.valueStatus2 = '';
          this.valueTip2 = '';
          callback();
        }else {
          this.valueStatus2 = 'error';
          this.valueTip2 = this.$t('Only-enter-int');
          return;
        }
      }
      if(this.form.getFieldValue('bps_r_unit') && value==undefined) {
        this.valueStatus2 = 'error';
        this.valueTip2 = this.$t('Enter') + this.$t('Int-num');
      }else {
        this.valueStatus2 = '';
        this.valueTip2 = '';
        callback();
      }
    },
    bpsValuePattern3(rule, value, callback) {
      if(value) {
        if(rule.pattern.test(value)) {
          this.valueStatus3 = '';
          this.valueTip3 = '';
          callback();
        }else {
          this.valueStatus3 = 'error';
          this.valueTip3 = this.$t('Only-enter-int');
          return;
        }
      }
      if(this.form.getFieldValue('bps_w_unit') && value==undefined) {
        this.valueStatus3 = 'error';
        this.valueTip3 = this.$t('Enter') + this.$t('Int-num');
      }else {
        this.valueStatus3 = '';
        this.valueTip3 = '';
        callback();
      }
    },
    bpsValuePattern4(rule, value, callback) {
      if(value) {
        if(rule.pattern.test(value)) {
          this.valueStatus4 = '';
          this.valueTip4 = '';
          callback();
        }else {
          this.valueStatus4 = 'error';
          this.valueTip4 = this.$t('Only-enter-int');
          return;
        }
      }
      if(this.form.getFieldValue('bps_r2_unit_total') && value==undefined) {
        this.valueStatus4 = 'error';
        this.valueTip4 = this.$t('Enter') + this.$t('Int-num');
      }else {
        this.valueStatus4 = '';
        this.valueTip4 = '';
        callback();
      }
    },
    bpsValuePattern5(rule, value, callback) {
      if(value) {
        if(rule.pattern.test(value)) {
          this.valueStatus5 = '';
          this.valueTip5 = '';
          callback();
        }else {
          this.valueStatus5 = 'error';
          this.valueTip5 = this.$t('Only-enter-int');
          return;
        }
      }
      if(this.form.getFieldValue('bps_r2_unit') && value==undefined) {
        this.valueStatus5 = 'error';
        this.valueTip5 = this.$t('Enter') + this.$t('Int-num');
      }else {
        this.valueStatus5 = '';
        this.valueTip5 = '';
        callback();
      }
    },
    bpsValuePattern6(rule, value, callback) {
      if(value) {
        if(rule.pattern.test(value)) {
          this.valueStatus6 = '';
          this.valueTip6 = '';
          callback();
        }else {
          this.valueStatus6 = 'error';
          this.valueTip6 = this.$t('Only-enter-int');
          return;
        }
      }
      if(this.form.getFieldValue('bps_w2_unit') && value==undefined) {
        this.valueStatus6 = 'error';
        this.valueTip6 = this.$t('Enter') + this.$t('Int-num');
      }else {
        this.valueStatus6 = '';
        this.valueTip6 = '';
        callback();
      }
    },

    //检测数值输入后单位是否为空
    bpsUnitPattern1(rule, value, callback) {
      if(this.form.getFieldValue('bps_total') && value==undefined) {
        this.unitStatus1 = 'error';
        this.unitTip1 = this.$t('Choose') + this.$t('Unit');
      }else {
        this.unitStatus1 = '';
        this.unitTip1 = '';
        callback();
      }
    },
    bpsUnitPattern2(rule, value, callback) {
      if(this.form.getFieldValue('bps_r') && value==undefined) {
        this.unitStatus2 = 'error';
        this.unitTip2 = this.$t('Choose') + this.$t('Unit');
      }else {
        this.unitStatus2 = '';
        this.unitTip2 = '';
        callback();
      }
    },
    bpsUnitPattern3(rule, value, callback) {
      if(this.form.getFieldValue('bps_w') && value==undefined) {
        this.unitStatus3 = 'error';
        this.unitTip3 = this.$t('Choose') + this.$t('Unit');
      }else {
        this.unitStatus3 = '';
        this.unitTip3 = '';
        callback();
      }
    },
    bpsUnitPattern4(rule, value, callback) {
      if(this.form.getFieldValue('bps2_total') && value==undefined) {
        this.unitStatus4 = 'error';
        this.unitTip4 = this.$t('Choose') + this.$t('Unit');
      }else {
        this.unitStatus4 = '';
        this.unitTip4 = '';
        callback();
      }
    },
    bpsUnitPattern5(rule, value, callback) {
      if(this.form.getFieldValue('bps_r2') && value==undefined) {
        this.unitStatus5 = 'error';
        this.unitTip5 = this.$t('Choose') + this.$t('Unit');
      }else {
        this.unitStatus5 = undefined;
        this.unitTip5 = '';
        callback();
      }
    },
    bpsUnitPattern6(rule, value, callback) {
      if(this.form.getFieldValue('bps_w2') && value==undefined) {
        this.unitStatus6 = 'error';
        this.unitTip6 = this.$t('Choose') + this.$t('Unit');
      }else {
        this.unitStatus6 = '';
        this.unitTip6 = '';
        callback();
      }
    },
  }
}
</script>

<style scoped>
  .tip-img {
    vertical-align: text-bottom;
  }
  .font-style {
    color: #333;
    font-weight: 700;
    margin-right: 5px;
  }
  .second-input {
    /* width: 180px; */
  }
</style>